<template>
  <v-card flat title="选课数据">
        <v-btn
          icon="mdi-plus"
          @click="openDialog"
          style="margin-left: 20px"
        ></v-btn>
    <template v-slot:text>
      <div class="d-flex flex-row">
        <v-text-field
          style="margin: 5px"
          v-model="searchCid"
          label="课程号"
          variant="outlined"
        ></v-text-field>
        <v-text-field
          style="margin: 5px"
          v-model="searchTid"
          label="教师号"
          variant="outlined"
        ></v-text-field>
        <v-text-field
          style="margin: 5px"
          v-model="searchSid"
          label="学生号"
          variant="outlined"
        ></v-text-field>
        <v-btn icon="mdi-magnify" style="margin: 5px" @click="searchS"></v-btn>
      </div>
    </template>

    <!-- 弹出对话框 -->

    <v-dialog v-model="newDialog" max-width="500px" persistent>
      <v-card>
        <v-card-title>填写成绩信息</v-card-title>
        <v-card-text>
          <v-form>
            <!-- 在这里添加输入框 -->
            <v-text-field
              v-model="edited.course_id"
              label="课程号"
            ></v-text-field>
            <v-text-field
              v-model="edited.staff_id"
              label="教师号"
            ></v-text-field>
            <v-text-field
              v-model="edited.student_id"
              label="学生学号"
            ></v-text-field>
            <v-text-field
              v-model="edited.semester" 
              label="学期">
            </v-text-field>
          </v-form>
        </v-card-text>
        <v-card-actions>
          <v-btn @click="saveChanges">保存</v-btn>
          <v-btn @click="closeDialog">关闭</v-btn>
        </v-card-actions>
      </v-card>
    </v-dialog>
    <v-dialog v-model="editDialog" max-width="500px" persistent>
      <v-card>
        <v-card-title>修改成绩信息</v-card-title>
        <v-card-text>
          <v-form>
            <!-- 在这里添加输入框 -->
            <v-text-field
              v-model="change.course_id"
              label="课程号"
              readonly
            ></v-text-field>
            <v-text-field
              v-model="change.staff_id"
              label="教师号"
              readonly
            ></v-text-field>
            <v-text-field
              v-model="change.student_id"
              label="学生学号"
              readonly
            ></v-text-field>
            <v-text-field v-model="change.semester" label="学期"></v-text-field>
            <v-text-field
              v-model="change.normal_score"
              label="平时成绩"
              @update:model-value="
                (change.total_score = Math.trunc(
                  (Number(change.normal_score) + Number(change.test_score)) / 2
                )),
                  (change.gpa = calculate_gpa(change.total_score))
              "
            ></v-text-field>
            <v-text-field
              v-model="change.test_score"
              label="期末成绩"
              @update:model-value="
                (change.total_score = Math.trunc(
                  (Number(change.normal_score) + Number(change.test_score)) / 2
                )),
                  (change.gpa = calculate_gpa(change.total_score))
              "
            ></v-text-field>
            <v-text-field
              v-model="change.total_score"
              label="总成绩"
              readonly
            ></v-text-field>
            <v-text-field
              v-model="change.gpa"
              label="绩点"
              readonly
            ></v-text-field>
          </v-form>
        </v-card-text>
        <v-card-actions>
          <v-btn @click="saveEdit">保存</v-btn>
          <v-btn @click="closeEditDialog">关闭</v-btn>
        </v-card-actions>
      </v-card>
    </v-dialog>

    <!-- 数据表格 -->
    <v-card>
      <v-card-item>
        <v-data-table :headers="Headers" :items="items" :search="search">
          <template v-slot:item="{ item }">
            <tr>
              <!-- 'course_id','course_name','staff_id','teacher_name','student_id','student_name','semester','normal_score','test_score','total_score' -->
              <td>{{ item.course_id }}</td>
              <td>{{ item.course_name }}</td>
              <td>{{ item.staff_id }}</td>
              <td>{{ item.teacher_name }}</td>
              <td>{{ item.student_id }}</td>
              <td>{{ item.student_name }}</td>
              <td>{{ item.semester }}</td>
              <td>{{ item.normal_score }}</td>
              <td>{{ item.test_score }}</td>
              <td>{{ item.total_score }}</td>
              <td>{{ item.gpa }}</td>
            </tr>
          </template>
        </v-data-table>
      </v-card-item>
    </v-card>
  </v-card>
</template>
<script>
import axios from "axios";
export default {
  created() {
    this.searchS();
  },
  data() {
    return {
      search: "",
      pageSelected: -1,
      searchTid: "",
      searchSid: "",
      searchCid: "",
      refresh: true,
      newDialog: false,
      editDialog: false,
      Headers: [
        //'course_id','course_name','staff_id','teacher_name','student_id','student_name','semester','normal_score','test_score','total_score'
        { key: "course_id", align: "start", title: "课程号" },
        { key: "course_name", title: "课程名" },
        { key: "staff_id", title: "教师号" },
        { key: "teacher_name", title: "教师名" },
        { key: "student_id", title: "学号" },
        { key: "student_name", title: "学生名" },
        { key: "semester", title: "学期" },
        { key: "normal_score", title: "平时成绩" },
        { key: "test_score", title: "期末成绩" },
        { key: "total_score", title: "总评成绩" },
        { key: "gpa", title: "绩点" },
      ],
      items: [],
      edited: {},
      change: {},
    };
  },
  methods: {
    async searchS() {
      // 处理搜索按钮点击事件
      console.log("Searching for:", this.searchid, this.searchname);
      let new_items = [];
      await axios({
        method: "get",
        url: "http://127.0.0.1:8000/admin/course_selection",
        params: {
          course_id: this.searchCid,
          student_id: this.searchSid,
          staff_id: this.searchTid,
        },
      }).then((res) => {
        console.log("searchS:", res);
        new_items = res.data;
      });
      this.items = new_items.data;
      // 在这里可以添加搜索逻辑
    },
    async deleteT(item) {
      console.log("Deleting teacher with id:", this.deleteTid);

      await axios({
        method: "get",
        url: "http://127.0.0.1:8000/admin/course_selection/delete",
        params: {
          staff_id: item.staff_id,
          course_id: item.course_id,
          student_id: item.student_id,
          semester: item.semester,
        },
      }).then((res) => {
        console.log("deleteT:", res.data);
      });
      this.searchS();
    },
    showDropdown(item) {
      // 处理下拉菜单按钮点击事件
      console.log("Dropdown clicked for:", item);
      // 在这里可以添加下拉菜单的显示逻辑
    },
    openDialog() {
      // 初始化编辑的学生信息
      this.newDialog = true;
      this.edited = {
        course_id: "",
        staff_id: "",
        student_id: "",
        semester: "",
      };
      this.dialog = true;
    },
    async saveChanges() {
      // 处理保存逻辑，可以将编辑后的学生信息保存到数据中
      console.log("Saved changes:", this.edited);
      await axios({
        method: "get",
        url: "http://127.0.0.1:8000/admin/course_selection/add",
        params: {
          //student_id, semester, course_id, staff_id, normal_score, test_score, total_score
          student_id: this.edited.student_id,
          semester: this.edited.semester,
          course_id: this.edited.course_id,
          staff_id: this.edited.staff_id,
        },
      }).then((res) => {
        console.log("addS:", res.data);
      });
      // 关闭对话框
      this.newDialog = false;
      this.searchS();
    },
    closeDialog() {
      // 关闭对话框
      this.newDialog = false;
    },
    openEditDialog(item) {
      // 初始化编辑的学生信息
      this.editDialog = true;
      this.change = item;
      this.dialog = true;
    },
    closeEditDialog() {
      // 关闭对话框
      this.editDialog = false;
    },
    async saveEdit() {
      // 处理保存逻辑，可以将编辑后的学生信息保存到数据中
      console.log("Saved changes:", this.change);
      await axios({
        method: "get",
        url: "http://127.0.0.1:8000/admin/course_selection/update",
        params: {
          //student_id, semester, course_id, staff_id, normal_score, test_score, total_score
          student_id: this.change.student_id,
          semester: this.change.semester,
          course_id: this.change.course_id,
          staff_id: this.change.staff_id,
          normal_score: this.change.normal_score,
          test_score: this.change.test_score,
          total_score: this.change.total_score,
          gpa: this.change.gpa,
        },
      }).then((res) => {
        console.log("editT:", res.data);
      });
      // 关闭对话框
      this.editDialog = false;
      this.searchS();
    },
    calculate_gpa(total_score) {
      if (total_score >= 90) {
        return 4.0;
      } else if (total_score >= 85) {
        return 3.7;
      } else if (total_score >= 82) {
        return 3.3;
      } else if (total_score >= 78) {
        return 3.0;
      } else if (total_score >= 75) {
        return 2.7;
      } else if (total_score >= 72) {
        return 2.3;
      } else if (total_score >= 68) {
        return 2.0;
      } else if (total_score >= 66) {
        return 1.7;
      } else if (total_score >= 64) {
        return 1.5;
      } else if (total_score >= 60) {
        return 1.0;
      } else {
        return 0.0;
      }
    },
  },
};
</script>
